<template>
  <!-- 管理车源——批量管理 -->
  <view class="container">
    <u-toast ref="uToast" />
    <scroll-view scroll-y style="height: 100%;width: 100%;" @scrolltolower="onreachBottom">
      <view class="defaultMap" v-if="!pageList.length">
        <image src="https://files.yzsheng.com/bussiness/imgs/tu@2x.png"></image>
        <view class="texna">
          暂无车源
        </view>
      </view>
      <view class="mid-item" v-for="(item,index) in pageList" :key="index" :class="index == (pageList.length - 1) ? 'active' : ''">
        <view class="header" @click="selectCom(item,index)">
          <i-icon v-show="!item.check" icon="icontuoyuan" type="single" size="40rpx" color="#999999"></i-icon>
          <i-icon v-show="item.check" icon="icongouxuan" type="multiple" size="40rpx"></i-icon>
        </view>
        <view class="guan-item boxS">
          <view class="box-top">
            <view class="box-left">
              <image :src="item.goodimg"></image>
              <view v-show="item.shelve_Status===1" class="zhez">已下架</view>
            </view>
            <view class="box-right">
              <view class="box-name text-line2">{{item.car_Type_Name}}{{item.configuration_Name}}</view>
              <view class="box-right-item">
                <view class="text-line">渠道价：<text style="color:#EB5C02;font-weight: bold;">{{item.bus_Price}}</text></view>
              </view>
              <view class="box-right-item">
                <view class="text-line">零售价：<text style="color:#EB5C02;font-weight: bold;">{{item.client_Price}}</text></view>
              </view>
              <view class="box-right-item">
                <view class="text-line">上架时间：<text>{{item.shelve_Time}}</text></view>
              </view>
            </view>
          </view>
        </view>
      </view>
    </scroll-view>
    <view class="footer">
      <view class="footer-left" @click="allSelect(show)">
        <i-icon v-show="!show" icon="icontuoyuan" type="single" size="40rpx" color="#999999"></i-icon>
        <i-icon v-show="show" icon="icongouxuan" type="multiple" size="40rpx"></i-icon>
        <text>全选</text>
      </view>
      <view class="footer-right">
        <view class="f-item" @click="showShanchu=true">删除</view>
        <view class="f-item" @click="showXiajia=true">下架</view>
      </view>
    </view>

    <u-modal v-model="showShanchu" :mask-close-able="true" title="温馨提示" :title-style="{fontWeight: 'bold'}"
      :show-confirm-button="false">
      <view class="slot-content" style="padding-bottom: 50rpx;">
        <view class="mod-tis">是否确认删除此商品？</view>
        <view class="mod-btn">
          <view class="footerplgl" @click="showShanchu=false">
            取消
          </view>
          <view class="fabucheyuan" @click="footerBtn(1)">
            确认删除
          </view>
        </view>
      </view>
    </u-modal>

    <u-modal v-model="showXiajia" :mask-close-able="true" title="温馨提示" :title-style="{fontWeight: 'bold'}"
      :show-confirm-button="false">
      <view class="slot-content" style="padding-bottom: 50rpx;">
        <view class="mod-tis">是否确认下架此商品？</view>
        <view class="mod-btn">
          <view class="footerplgl" @click="showXiajia=false">
            取消
          </view>
          <view class="fabucheyuan" @click="footerBtn(0)">
            确认下架
          </view>
        </view>
      </view>
    </u-modal>
  </view>
</template>

<script src="./theBatchManagement.js"></script>
<style lang="scss" scoped>
  @import './theBatchManagement.scss';
</style>
